<template>
    <div>
        <!-- <Child :title="title" @change="change"></Child> -->

         <!-- <Child :title="title" @update:title="change"></Child>  -->

         <!-- <Child :title.sync="title" ></Child> -->

         <!-- {{visible}}

         <Child :visible.sync="visible"></Child> -->

         <!-- sync -->

         <!-- <Child :visible.sync="visible"></Child>  -->

        {{title}}
         <!-- <input type="text" v-model="title"> -->
         <!-- <input type="text" :value="title" @input="(e)=>{title = e.target.value}"> -->

         <!-- <Child :value="title" @input="(text)=>{title=text}"></Child> -->

         <Child v-model="title"></Child>
    </div>
</template>

<script>
import Child from './child.vue'
export default {
    components:{
        Child
    },
    data(){
        return {
            title:'你好',
            visible:false
        }
    },
    methods:{
        change(val){
            this.title = val
        }
    }
}
</script>